*{
    padding:0;
    margin:0;
}
.box{
    background-color:#ccc;
    width:1100px;
    margin:0 auto;
    position: relative;
}
li{
    list-style: none;
    display: inline-block;
    vertical-align: middle;
    padding:20px;
}
a{
    text-decoration: none;
    color:#666;
}
ul{
    height:100px;
    line-height: 10px;
}
 .icon1{
     height: 10px;
     background: url("images/iconsB_11.gif") no-repeat 10px 10px;
     transition:all 1s ease;
}
.icon1:hover{
     transform: rotate(360deg);
 }
.icon2{
    height: 10px;
    background: url("images/iconsB_12.gif") no-repeat 10px 10px;
}
.icon3{
    height: 10px;
    background: url("images/iconsB_13.png") no-repeat 10px 10px;
}

.pic1{
    width:40px;
    height:20px;
    display: block;
    background:url("images/header_03.png") no-repeat 0 0;
    position: absolute;
    left:250px;
    top:10px;
}
.pic1:hover{
    width:70px;
    height:20px;
    display: block;
    background:url("images/header_05.png") no-repeat 0 0;
    animation: donghua .1s;
}
.pic2{
    width:40px;
    height:20px;
    display: block;
    background:url("images/header_07.png") no-repeat 0 0;
    position: absolute;
    left:470px;
    top:10px;
}
.pic2:hover{
    width:70px;
    height:20px;
    display: block;
    background:url("images/header_09.png") no-repeat 0 0;
    animation: donghua .1s;
}
@keyframes donghua{
    0%{
        width:40px;
    }
    100%{
        width:40px;
    }
}

